<script setup lang="ts">
  import { computed, PropType, ref, watch } from 'vue'
  import {
    useAutoCheckEndOrder,
    useReceiveOrderStrategy,
    useAutoCheckCancelOrder,
    useUpdateViewKnowStrategy,
    useUpdatSpareApplyStrategy,
    useUpdateCreateOrderStrategy,
    useAllowAntiFakeQueryStrategy,
    useUpdateChangeSparePriceStrategy,
    useUpdateallowUpdateSnCodeFun,
  } from '@/services/pages/network/list'
  import infoTip from '@/config/info-tip'
  import { HMessage, HMessageBox } from '@/components/common/message'
  import useFreeAmountVisibleStrategyService from '@/services/pages/network/list/useFreeAmountVisibleStrategyService'

  const {
    updateFreeAmountVisibleStrategyForm,
    updateFreeAmountVisibleStrategyLoading,
    updateFreeAmountVisibleStrategy,
  } = useFreeAmountVisibleStrategyService()
  const { isEnableUpdateSparePrice, enableUpdateSparePriceLoading, enableUpdateSparePriceFn } =
    useUpdateChangeSparePriceStrategy()
  const { autoSureReceiveOrder, updateAutoSureReceiveOrderLoading, updateAutoSureReceiveOrderFn } =
    useReceiveOrderStrategy()
  const { autoCheckEndOrder, autoCheckEndOrderLoading, autoCheckEndOrderFn } =
    useAutoCheckEndOrder()
  const { autoCheckCancelOrder, autoCheckCancelOrderLoading, autoCheckCancelOrderFn } =
    useAutoCheckCancelOrder()
  const { isAllowAntiFakeQuery, allowAntiFakeQueryLoading, multipleUpdateAntiFakeQueryStrategy } =
    useAllowAntiFakeQueryStrategy()
  const {
    isAllowCreateOrder,
    updateCreateOrderStrategyLoading,
    multipleUpdateCreateOrderStrategy,
  } = useUpdateCreateOrderStrategy()
  const { isAllowSpareApply, updateSpareApplyStrategyLoading, multipleUpdateSpareApplyStrategy } =
    useUpdatSpareApplyStrategy()
  const { isAllowViewKnow, updateViewKnowStrategyLoading, multipleUpdateViewKnowStrategy } =
    useUpdateViewKnowStrategy()
  const { allowUpdateSnCode, updateAllowUpdateSnCodeLoading, updateallowUpdateSnCodeFn } =
    useUpdateallowUpdateSnCodeFun()
  defineOptions({
    name: 'NetworksStrategy',
  })

  const props = defineProps({
    networkIds: {
      type: Array as PropType<Array<string>>,
      required: true,
    },
  })

  const emits = defineEmits<{
    (e: 'update'): void
  }>()

  // 工单id集合
  const ids = ref<Array<string>>([])

  // 弹窗显示状态
  const dialogVisible = ref(false)

  // 更新策略加载
  const loading: any = computed(() => {
    return (
      enableUpdateSparePriceLoading.value ||
      updateAutoSureReceiveOrderLoading.value ||
      autoCheckEndOrderLoading.value ||
      autoCheckCancelOrderLoading.value ||
      allowAntiFakeQueryLoading.value ||
      updateCreateOrderStrategyLoading.value ||
      updateSpareApplyStrategyLoading.value ||
      updateViewKnowStrategyLoading.value ||
      updateAllowUpdateSnCodeLoading.value ||
      updateFreeAmountVisibleStrategyLoading.value
    )
  })

  /**
   * 取消事件
   */
  const onCancel = () => {
    dialogVisible.value = false
  }

  /**
   * 确定事件
   * @param {StrategyOperateType} type - 策略操作类型
   */
  const onConfirm = async () => {
    updateFreeAmountVisibleStrategyForm.value.networkIds = props.networkIds
    Promise.all([
      enableUpdateSparePriceFn(props.networkIds),
      updateAutoSureReceiveOrderFn(props.networkIds),
      autoCheckEndOrderFn(props.networkIds),
      autoCheckCancelOrderFn(props.networkIds),
      multipleUpdateAntiFakeQueryStrategy(props.networkIds),
      multipleUpdateCreateOrderStrategy(props.networkIds),
      multipleUpdateSpareApplyStrategy(props.networkIds),
      multipleUpdateViewKnowStrategy(props.networkIds),
      updateallowUpdateSnCodeFn(props.networkIds),
      updateFreeAmountVisibleStrategy(),
    ]).then((res) => {
      const error = res.find((item) => item.code !== 20000)
      if (error) {
        HMessageBox.error(error.message)
        return
      }

      HMessage.success(infoTip.network.list.updateStrategySuccess)
      dialogVisible.value = false
      emits('update')
    })
  }

  watch(
    () => props.networkIds,
    (value) => {
      ids.value = value
    },
  )
</script>

<template>
  <div>
    <h-button
      :disabled="!props.networkIds || props.networkIds.length <= 0"
      @click="dialogVisible = true"
      >编辑策略</h-button
    >

    <h-dialog v-model="dialogVisible" title="编辑策略" :width="800" :loading="loading">
      <el-form class="modal_form_content" label-width="80">
        <el-form-item label="物料价格">
          <el-radio-group v-model="isEnableUpdateSparePrice">
            <el-radio :value="true" size="small">允许修改</el-radio>
            <el-radio :value="false" size="small">禁止修改</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="接单策略">
          <el-radio-group v-model="autoSureReceiveOrder">
            <el-radio :value="true" size="small">自动接单</el-radio>
            <el-radio :value="false" size="small">手动接单</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="结单审核">
          <el-radio-group v-model="autoCheckEndOrder">
            <el-radio :value="false" size="small">人工审核</el-radio>
            <el-radio :value="true" size="small">自动审核</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="取消工单">
          <el-radio-group v-model="autoCheckCancelOrder">
            <el-radio :value="false" size="small">人工审核</el-radio>
            <el-radio :value="true" size="small">自动审核</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="防伪查询">
          <el-radio-group v-model="isAllowAntiFakeQuery">
            <el-radio :value="false" size="small">不允许</el-radio>
            <el-radio :value="true" size="small">允许</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="新建工单">
          <el-radio-group v-model="isAllowCreateOrder">
            <el-radio :value="false" size="small">不允许</el-radio>
            <el-radio :value="true" size="small">允许</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="物料申请">
          <el-radio-group v-model="isAllowSpareApply">
            <el-radio :value="false" size="small">不允许</el-radio>
            <el-radio :value="true" size="small">允许</el-radio>
          </el-radio-group>
        </el-form-item>

        <el-form-item label="知识库查看">
          <el-radio-group v-model="isAllowViewKnow">
            <el-radio :value="false" size="small">不允许</el-radio>
            <el-radio :value="true" size="small">允许</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="修改条码">
          <el-radio-group v-model="allowUpdateSnCode">
            <el-radio :value="false" size="small">不允许</el-radio>
            <el-radio :value="true" size="small">允许</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="免费额度查看">
          <el-radio-group v-model="updateFreeAmountVisibleStrategyForm.allowSelectAmount">
            <el-radio :value="false" size="small">不允许</el-radio>
            <el-radio :value="true" size="small">允许</el-radio>
          </el-radio-group>
        </el-form-item>
      </el-form>

      <template #footer>
        <h-button is-modal type="primary" @click="onConfirm">确定</h-button>
        <h-button is-modal @click="onCancel">取消</h-button>
      </template>
    </h-dialog>
  </div>
</template>

<style lang="scss">
  .modal_form_content {
    padding-top: 18px;
    column-gap: 48px;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;

    .el-form-item {
      width: 210px;

      .el-form-item__label {
        padding: 0 4px 0 0 !important;
        justify-content: flex-end;
      }
    }
  }
</style>
